function DrawMap(cw, ch, list, callfun) {

	/**  使用说明
	 var drawlist=[
			  {type:"fillrect",fillStyle:"#f4f5e6",x:0,y:0,w:710,h:1065},
              {type:"img",url:topImgUrl,x:30,y:151,w:650,h:650},
			  {type:"text",fillStyle:"#000000",font:"32px 微软雅黑",text:"文本内容",x:30,y:72,maxw:600},
			  {type:"text",fillStyle:"#888888",font:"30px 微软雅黑",text:"文本内容",x:290,y:977;maxw:400},
			];

          DrawMap(710,1065,drawlist,function(canvas){
		       var maincanvas= $("#xkdcode")[0];
                var ctx=maincanvas.getContext('2d');
				ctx.drawImage(canvas,0,0,710,1065);
				canvas=null;
				ctx=null;
		   });

	 **/
	var canvas = document.createElement('canvas');
	canvas.width = cw;
	canvas.height = ch;
	var ctx = canvas.getContext('2d');

	var imgnum = 0;
	list.forEach(function (item, index) {

		if (item.type == "img") {
			imgnum++;
		}
	});
	var loadimgnum = 0;
	var hascallback = false;
	list.forEach(function (item, index) {
		if (item.type) {
			switch (item.type) {
				case "fillrect": 
					ctx.fillStyle = item.fillStyle;
					ctx.fillRect(item.x, item.y, item.w, item.h);
					break;
				case "img": 

					var loadImg = new Image();
					loadImg.crossOrigin = "Anonymous"; 
					loadImg.onload = function () {
						// 图片剪切之后再填充到画板
						var clipCanvas = document.createElement('canvas');
						clipCanvas.width = item.w;
						clipCanvas.height = item.w;
						var clipCtx = clipCanvas.getContext('2d');
						clipCtx.rect(0, 0, 750, 750);
						clipCtx.stroke();
						clipCtx.clip();
						if (item.h) {
							clipCtx.drawImage(loadImg, 0, 0, item.w, item.h);
						} else {
							var imgH = parseInt(this.height * item.w / this.width);
							clipCtx.drawImage(loadImg, 0, 0, item.w, imgH);
						}
						var clipImgUrl = clipCanvas.toDataURL("image/png");
						var clipImg = new Image();
						clipImg.src = clipImgUrl;

						clipImg.onload = function () {
							
							ctx.drawImage(clipImg, item.x, item.y, item.w, item.w);
							loadimgnum++;
							if (loadimgnum >= imgnum && callfun && !hascallback) {
								hascallback = true;
								callfun(canvas);
							}
						}
					}
					loadImg.src = item.url; ///����ͼƬ

					break;
				case "text":
					ctx.fillStyle = item.fillStyle;
					ctx.font = item.font;

					var chr = item
						.text
						.split("");
					var temp = "";
					var row = [];

					var rowHight = parseInt(item.font) * 1.2;

					var w = item.maxw;

					if (w == null) {
						w = cw - item.x - 50;
					}

					for (var a = 0; a < chr.length; a++) {
						if (ctx.measureText(temp).width > w) {
							row.push(temp);
							temp = "";
						}
						temp += chr[a];
					}
					row.push(temp);

					for (var b = 0; b < row.length; b++) {
						ctx.fillText(row[b], item.x, item.y + b * rowHight);
					}
					break;

			}
		}

	});

	if (loadimgnum >= imgnum && callfun && !hascallback) {
		hascallback = true;
		callfun(canvas);
	}
	return canvas;
}

